// 组件变量
// 名称可按如下规则定义：
// <component>-[type]-[attrtype]-<attr>-[status]

// component:组件名，如button，
// type: 组件类型，如 button 的次要按钮（line）
// attrtype: 属性的具体应用场景。如颜色，用于背景（bg）、文本（text）、边框（border）等
// attr: 属性名称，如color、height、radius等
// status: 表示组件状态或尺寸，如 hover、disabled、s、l 等

// 如：@button-line-bg-color-hover
// 如：@button-line-height-s

// base
@cascader-highlight-color: @text-color-brand;
@cascader-border: 1px solid @border-level-2-color;
@cascader-border-color-disabled: @border-level-2-color;
@cascader-active-border-color: @brand-color;
@cascader-selected-color: @text-color-placeholder;
@cascader-input-shadow: 0 0 0px 2px @brand-color-focus;
@cascader-color-default: @text-color-primary;
@cascader-light-color: @text-color-placeholder;
@cascader-dark-color: @text-color-primary;

// tag
@cascader-tag-color: @text-color-primary;
@cascader-tag-border-color: @border-level-2-color;
@cascader-tag-color-disabled: @text-color-disabled;
@cascader-tag-background-color-disabled: @bg-color-component-disabled;
@cascader-tag-margin: 2px 4px 2px 0;
@cascader-tag-margin-s: 1px 1px 1px 0;

// 输入框尺寸
@cascader-input-width: 320px;
@cascader-input-padding: 0px 26px 0px 4px;
@cascader-input-padding-is-multiple: 1px 28px 1px 3px;
@cascader-input-padding-is-multiple-s: 0px 28px 0px 1px;
@cascader-input-inner-height: 28px;

// 外框主体高度
@cascader-height-s: 24px;
@cascader-height-default: 32px;
@cascader-height-l: 40px;

// 外框主体字体大小
@cascader-font-size-s: @font-size-s;
@cascader-font-size-default: @font-size-base;
@cascader-font-size-l: @font-size-l;

// 菜单项宽度
@cascader-width-s: 150px;
@cascader-width-l: 200px;

// 弹出面板不同状态的高度
@cascader-panel-height-normal: 200px;
@cascader-panel-height-multiple: 280px;
@cascader-panel-height-tips: 40px;
@cascader-content-margin-left: 4px;

// 下拉面板
@cascader-dropdown-border-radius: @border-radius;
@cascader-dropdown-border: 1px solid @bg-color-secondarycontainer-active;
@cascader-dropdown-margin: 10px 0 5px 0;

// menu面板
@cascader-menu-segment-color: @component-stroke;
@cascader-menu-padding: 8px;

@cascader-color-empty: @text-color-disabled;

// item
@cascader-item-color-selected: @brand-color;
@cascader-item-color-hover: @bg-color-container-hover;
@cascader-item-color-disabled: @text-color-disabled;
@cascader-item-background-color-expanded: @brand-color-light;
@cascader-item-height-s: 22px;
@cascader-item-height-default: 40px;
@cascader-item-height-l: 40px;
@cascader-item-margin-top: 4px;
@cascader-item-border-radius: @border-radius;
@cascader-item-padding-with-icon: 0 22px 0 8px;
@cascader-item-padding: 0 8px;
@cascader-item-padding-with-icon-l: 0 22px 0 12px;
@cascader-item-padding-l: 0 12px;
@cascader-item-icon-color: @text-color-secondary;

// icon
@cascader-icon-margin: 0 8px;
@cascader-icon-size: 16px;
@cascader-icon-color: @text-color-placeholder;
